<template>
  <div class="allorder">
    <van-cell-group v-for="item in single" :key="item.id" :border="false">
      <van-cell :border="false" title-style="font-weight: bold;" @click="toDetail(item.id)" :title="item.seller_id==0?'总部':item.spf_name" :value="item.state==1?'待发货':item.state==3?'配送中':item.state==4?'待收货':item.state==5?'已完成':''" />
      <van-cell :border="false" :title="item.receiver.username + ' ' + item.receiver.phone" @click="toDetail(item.id)">
        <template #label>
          <div>{{item.receiver.province + item.receiver.city + item.receiver.district + item.receiver.address}}</div>
        </template>
      </van-cell>
      <van-cell :border="false" :title="'共 ' + item.products_num +' 件商品'" :value="'￥' + item.realFee" value-class="allorder-money" />
      <div class="spacing"></div>
    </van-cell-group>
    <van-empty description="暂无数据" v-if="single.length == 0" />
  </div>
</template>
          
<script>
export default {
  name: 'AllOrder', // 所有订单
  data () {
    return {
      single: {},
    }
  },
  methods: {
    toDetail (sid) {
      this.$router.push({ path: `/historysDetail/${sid}` })
    },
    getAllOrder () {
      this.$axios("/buy/myorderlist", {
        page: 1, //分页页码，数字类型
        limit: 10,
      })
        .then((res) => {
          this.single = res.data.data
        })
        .catch((err) => {
          console.error(err);
        });
    },
  },
  created () {
    this.getAllOrder()
  },
}
</script>

<style lang="less" scoped>
.allorder {
  height: 100%;
  background-color: #f7f8fa;
  .spacing {
    width: 100%;
    height: 15px;
    background-color: #f7f8fa;
  }
  &-money {
    color: #e55252;
    font-weight: bold;
  }
  &-rt {
    font-size: 25px;
    text-align: right;
    padding: 0 30px;
    color: #aaa;
  }
}
</style>